<template>
  <div class="app-container">
    <div class="head">
      <img src="@/assets/img/Layout/position.png" />
      <p class="see-block">分公司详情</p>
    </div>
    <div class="view-container">
      <el-row class="status-title">
        <el-col class="mr20 width100">
          <el-button
            class="btn-default width100"
            type="primary"
            @click="edit()"
            v-hasPermi="['system:sysOrg:edit']"
          >编辑</el-button>
        </el-col>
        <!-- <el-col class="mr20 width100" v-if="detailData.status == 1">
            <el-button
                class="btn-enable width100"
                type="primary"
                @click="enable()"
                v-hasPermi="['system:sysOrg:enable']"
            >启用</el-button>
        </el-col>
        <el-col class="mr20 width100" v-if="detailData.status == 0">
            <el-button
                class="btn-delete width100"
                type="primary"
                @click="disable()"
                v-hasPermi="['system:sysOrg:enable']"
            >禁用</el-button>
        </el-col> -->
      </el-row>
      <el-row class="detail-item">
        <el-col :span="12">
          <span>编码：</span>{{ detailData.code ?  detailData.code : '暂无'}}
        </el-col>
        <el-col :span="12">
          <span>公司名称：</span>{{ detailData.orgName ?  detailData.orgName : '暂无'}}
        </el-col>
      </el-row>
      <el-row class="detail-item">
        <el-col :span="12">
          <span>组织机构代码：</span>{{ detailData.orgCode ?  detailData.orgCode : '暂无'}}
        </el-col>
        <el-col :span="12">
          <span>类型：</span>{{ detailData.type == '1' ?  '公司' : detailData.type == '2' ? '生产企业' : '暂无'}}
        </el-col>
      </el-row>
      <el-row class="detail-item">
        <el-col :span="12">
          <span>是否平台公司：</span>{{ detailData.productOrNot == '0' ?  '否' : '是'}}
        </el-col>
      </el-row>
      <el-row class="detail-item">
        <el-col :span="12">
          <span>法人：</span>{{ detailData.leader ?  detailData.leader : '暂无'}}
        </el-col>
        <el-col :span="12">
          <span>法人电话：</span>{{ detailData.leaderPhone ?  detailData.leaderPhone : '暂无'}}
        </el-col>
      </el-row>
      <el-row class="detail-item">
        <el-col :span="12">
          <span>联系人：</span>{{ detailData.contact ?  detailData.contact : '暂无'}}
        </el-col>
        <el-col :span="12">
          <span>联系电话：</span>{{ detailData.contactNumber ?  detailData.contactNumber : '暂无'}}
        </el-col>
      </el-row>
      <el-row class="detail-item">
        <el-col :span="24">
          <span>地址：</span>{{ detailData.province ? detailData.province : '暂无' }}{{ detailData.city ? detailData.city : '' }}{{ detailData.region ? detailData.region : '' }}{{ detailData.contactAddress ? detailData.contactAddress : '' }}
        </el-col>
      </el-row>
      <el-row class="detail-item">
        <el-col :span="12">
          <span>备注：</span>{{ detailData.remark ?  detailData.remark : '暂无'}}
        </el-col>
      </el-row>
      <el-row class="detail-item">
        <el-col :span="12">
          <span>账号：</span>{{ detailData.userName ?  detailData.userName : '暂无'}}
        </el-col>
        <el-col :span="12">
          <span>状态：</span>
          <!-- {{ detailData.status == '0' ? '正常' : '禁用' }} -->
          <font v-if="detailData.status == 1" style="color:#fd562c">禁用</font>
          <font v-if="detailData.status == 0" style="color:#52C41A">正常</font>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import { organizationDetail, organizationEnable } from "@/api/system/organization/organization"
export default {
  name: "organizationDetail",
  data(){
    return {
      id: '',
      detailData: ''
    }
  },
  created() {
    this.id = this.$route.query.id
    this.getDetailData()
  },
  methods: {
    // 获取详细信息
    getDetailData(){
      organizationDetail(this.id).then(res => {
        this.detailData = res.data
      })
    },
    // 编辑
    edit(){
      this.$tab.closeOpenPage({ path: "/setting/organization/edit", query:{id: this.id} })
    },
    // 启用
    enable(){
      this.$modal.confirm('是否确认启用？', '启用').then(() => {
        organizationEnable(this.id, this.detailData.deptId, 0).then(res => {
          if(res.code == 200){
            this.$modal.msgSuccess("启用成功")
            this.getDetailData()
          }
        })
      }).catch(() => {})
    },
    // 禁用
    disable(){
      this.$modal.confirm('是否确认禁用？', '禁用').then(() => {
        organizationEnable(this.id, this.detailData.deptId, 1).then(res => {
          if(res.code == 200){
            this.$modal.msgSuccess("禁用成功")
            this.getDetailData()
          }
        })
      }).catch(() => {})
    }
  }
}
</script>